// cover some element-ui styles
.el-button {
  // min-width: 100px;
  // height: 28px;
}

.el-button--mini {
  height: 28px;
}

.el-breadcrumb__inner,
.el-breadcrumb__inner a {
  font-weight: 400 !important;
}

.el-upload {
  input[type="file"] {
    display: none !important;
  }
}

.el-upload__input {
  display: none;
}

// to fixed https://github.com/ElemeFE/element/issues/2461
.el-dialog {
  transform: none;
  left: 0;
  position: relative;
  margin: 0 auto;
}

// refine element ui upload
.upload-container {
  .el-upload {
    width: 100%;

    .el-upload-dragger {
      width: 100%;
      height: 200px;
    }
  }
}

// dropdown
.el-dropdown-menu {
  a {
    display: block;
  }
}

// to fix el-date-picker css style
.el-range-separator {
  box-sizing: content-box;
}
.el-popover {
  min-width: 0;
}

// .el-card {
//   color: $;
// }

.el-card__header {
  padding: 14px 20px;
}

.el-card__body {
  padding: 10px 20px;
}
.el-form {
  .el-form-item--mini.el-form-item,
  .el-form-item--small.el-form-item {
    margin-bottom: 14px;
  }

  .el-form-item__error {
    font-size: 10px;
  }
  label {
    font-weight: normal;
  }
}

.el-form-item__label,
.el-checkbox__label,
.el-radio__label {
  position: relative;
  font-size: 12px;
  // div {
  //   // margin-right: 4px;

  //   &::after {
  //     content: '*';
  //     color: #f56c6c;
  //     margin-left: 4px;
  //   }
  // }
}
// .el-form-item.is-required:not(.is-no-asterisk)
//   .el-form-item__label-wrap
//   > .el-form-item__label:before,
// .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:before {
//   content: "";
//   color: #f56c6c;
//   margin: 0;
// }
.el-form-item.is-required:not(.is-no-asterisk)
  .el-form-item__label-wrap
  > .el-form-item__label
  div::after,
.el-form-item.is-required:not(.is-no-asterisk)
  > .el-form-item__label
  div::after {
  content: "*";
  color: #f56c6c;
  margin-left: 5px;
}

.el-dialog__header {
  padding-top: 10px;
  border-bottom: 1px solid #bdc6cf;
  .el-dialog__title,
  .dialog-title {
    position: relative;
    font-size: 14px;

    &::after {
      position: absolute;
      left: -10px;
      top: 50%;
      margin-top: -7px;
      content: "";
      width: 4px;
      height: 14px;
      background: #409eff;
    }
  }
  .el-dialog__headerbtn {
    top: 6px;
    font-size: 20px;
  }
}

.el-table ,.el-card__body,.el-form-item__label,.el-popover{
  color: #333 !important;
}

.el-table .cell,
.el-table th > .cell {
  white-space: nowrap;
  width: fit-content;
}

.el-upload--text {
  width: 100%;
  .el-upload-dragger {
    width: 100%;
  }
}

.el-tabs--border-card {
  border: 0;
  border-top: 1px solid #dcdfe6;
}

.el-table td.is-center .cell,
.el-table th.is-center .cell {
  text-align: center;
  margin: 0 auto;
}

.tab-fixed {
  .el-tabs {
    .el-tabs__header {
      position: fixed;
      // width: 100%;
      z-index: 11;
      top: 0;
      left: 250px;

      .el-tabs__nav-wrap {
        &::after {
          height: 0;
        }

        .el-tabs__item {
          height: 64px;
          line-height: 64px;
        }
      }
    }

    // .el-tabs__content {
    //   padding-top: 50px !important;
    // }
  }
}

.no-fixed .el-tabs .el-tabs__header {
  position: relative !important;
  left:0px;
  background-color: #F5F7FA;
  border-bottom: 1px solid #E4E7ED;
  margin: 0;
}

.sidebar-container .el-scrollbar__wrap {
  // overflow: auto;
  // margin: 0 !important;
}
.el-button--primary {
  color: #fff;
  background-color: #2a90bc;
  border-color: #2a90bc;
}

input[type="hidden"] + .el-form-item--mini.el-form-item,
.el-form-item--small.el-form-item {
  margin-bottom: 0;
}

.el-menu--vertical > .el-menu--popup {
  // max-height: 70vh !important;
  // background: transparent !important;
  overflow-y: unset !important;
  // box-shadow: none !important;
}

.el-menu--vertical > .el-menu--popup .el-menu-item-group {
  clear: both;
  &::after {
    content: "";
    height: 0;
    line-height: 0;
    display: block;
    visibility: hidden;
    clear: both;
  }
}
.el-menu--vertical > .el-menu--popup {
  display: flex;
  // flex-wrap: wrap;
  // writing-mode: vertical-lr;
  width: 100%;
}

.el-menu--vertical > .el-menu--popup li {
  // writing-mode: horizontal-tb;
}

.el-step__head.is-finish {
  color: $green;
  border-color: $green;
}

.el-step__title.is-finish {
  color: $green;
}
.el-step__description.is-finish {
  color: $green;
}
.el-menu-item,
.el-submenu__title {
  font-size: 12px;
}

.el-menu--vertical > .el-menu--popup {
  max-height: 98vh !important;
}
.el-table th {
  font-size: 12px
}

.el-loading-mask {
  background-color: rgba($color: #000000, $alpha: 0.5);
  z-index: 5000;
}
.el-loading-spinner{
  /*这个是自己想设置的 gif 加载动图*/
  background-image:url('../assets/images/loading.gif');
  background-repeat: no-repeat;
  background-size: 300px 100px;
  height:100px;
  width:100%;
  background-position:center;
  /*覆盖 element-ui  默认的 50%    因为此处设置了height:100%,所以不设置的话，会只显示一半，因为被top顶下去了*/
  top:40%;
}
.el-loading-spinner .circular {
 /*隐藏 之前  element-ui  默认的 loading 动画*/
 display: none;
}

.el-loading-spinner .el-loading-text{
/*为了使得文字在loading图下面*/
 margin:100px 0px;
}

.handsontable td {
  color: #333;
}
